<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>订单查看</title>
    <script type="text/javascript" src="./js/vue.js"></script>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" href="css/weui.css">
    <link rel="stylesheet" href="css/jquery-weui.css">
    <link rel="stylesheet" href="css/style.css">
    <script>
        function getCookie(c_name) {
            if (document.cookie.length > 0) {
                c_start = document.cookie.indexOf(c_name + "=")
                if (c_start != -1) {
                    c_start = c_start + c_name.length + 1
                    c_end = document.cookie.indexOf(";", c_start)
                    if (c_end == -1) c_end = document.cookie.length
                    return unescape(document.cookie.substring(c_start, c_end))
                }
            }
            return ""
        }
    </script>

    <style>
        .products-list .weui-media-box_appmsg .weui-media-box__hd {
            width: 80px;
            height: 80px;
        }
        
        .products-list .weui-media-box {
            padding: 10px;
        }
        
        .products-list .weui-media-box__title {
            font-size: 15px;
            padding-right: 48px;
            white-space: normal;
            line-height: 20px;
            min-height: 54px;
            display: -webkit-box;
            -webkit-box-align: center;
            -moz-box-align: center;
            position: relative;
        }
        
        .products-list .weui-media-box__title .delete {
            position: absolute;
            right: 0;
            top: 50%;
            color: #898a8a;
            -webkit-transform: translate(0, -50%);
            /*background:url(images/icon28.png) no-repeat;*/
            background-size: 24px;
            width: 24px;
            height: 24px;
        }
        
        .products-list .weui-cell:before {
            border-top: none;
        }
        
        .products-list .weui-cell {
            padding: 0 10px 10px;
        }
        
        .products-list .weui-cell__ft {
            color: #e3313d;
        }
        
        .products-list .total {
            padding: 10px 0;
            margin: 0 10px;
            border-top: 1px solid #ececec;
        }
        
        .quantity {
            border: 1px solid #c7c7c7;
            height: 35px;
            display: inline-block;
            overflow: hidden;
            border-radius: 3px;
        }
        
        .quantity a {
            width: 35px;
            height: 35px;
            line-height: 35px;
            display: inline-block;
            font-size: 20px;
            text-align: center;
        }
        
        .quantity a:not(.weui-btn_disabled):active {
            background-color: #ececec;
        }
        
        .quantity input {
            width: 50px;
            height: 35px;
            text-align: center;
            border: none;
            vertical-align: top;
            font-size: 16px;
        }
        
        .quantity .subtract {
            border-right: 1px solid #c7c7c7;
        }
        
        .quantity .plus {
            border-left: 1px solid #c7c7c7;
        }
    </style>
</head>

<body style="background:#f3f3f3;">
    <h2>所有订单:</h2>
    <div id="root" class="weui-panel weui-panel_access products-list">
        <div class="weui-panel__bd" v-for="order in Orders" :key="order.ID">
            <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg">
                <!--  <div class="weui-media-box__hd">
	        <img class="weui-media-box__thumb" src="images/temp/9.jpg">
	      </div> -->
                <div class="weui-media-box__bd">
                    <div class="weui-media-box__title">订单信息</div>
                    <p class="weui-media-box__desc">礼物名称 {{order.gift_name}}</p>
                    <p class="weui-media-box__desc">描述信息 {{order.gift_info}}</p>
                    <div class="weui-media-box__title">个人信息</div>
                    <p class="weui-media-box__desc">姓名 {{order.user_name}}</p>
                    <p class="weui-media-box__desc">学号 {{order.student_id}}</p>
                    <p class="weui-media-box__desc">电话号码 {{order.phone_number}}</p>
                    <p class="weui-media-box__desc">地址 {{order.address}}</p>
                </div>
            </a>
            <!-- <div class="weui-cell">
		    <div class="weui-cell__bd">
		      <div class="price">￥399.00</div>
		    </div>
		    <div class="weui-cell__ft">
		    	<div class="quantity">
			    	<a href="javascript:void(0);" class="subtract">-</a><input type="tel" value="3"><a href="javascript:void(0);" class="plus">+</a>
			    </div>
		    </div>
	    </div> -->
            <div class="weui-cell total">
                <div class="weui-cell__ft">
                    <span>抢礼物结果</span>
                </div>
                <div class="weui-cell__bd"></div>
                <div class="weui-cell__ft">
                    <!--		    	<span v-if="order.IsSuccess===1">成功</span>-->
                    <!--				<span v-else="order.IsSuccess===1">失败</span>-->
                    <span v-if="order.is_success===1">成功</span>
                    <span v-else>失败</span>
                </div>
                </hr>
            </div>
        </div>
    </div>





    <script src="js/jquery.min.js"></script>
    <script src="js/jquery-weui.min.js"></script>
    <script src="js/fastclick.js"></script>

    <script type="text/javascript">
        Vue.config.productionTip = false //组织vue 在启动时生成生产提示。
        window.onload = function() {
            // var uid = getCookie("userId");
            // console.log(objname);
            let code = getQueryVariable("code")
            console.log(code)
            $.ajax({
                type: 'post',
                url: '/usersapi/getUserId',
                contentType: 'application/json',
                dataType: 'json',
                data: JSON.stringify({
                    "code": code,
                }),
                success: function(data) {
                    console.log(data)
                    if (Object.keys(data)[0] == 'code') {
                        window.location.href = '/error2.html'
                    }
                    const xhr = new XMLHttpRequest();
                    //设置响应体数据类型
                    xhr.responseType = 'json';
                    // var sendData = {uid:uid};
                    xhr.open('GET', 'http://139.224.246.43:8084/orderapi/getAllOrders');
                    xhr.setRequestHeader('content-type', 'application/json');
                    // xhr.send(JSON.stringify(sendData));
                    xhr.send();
                    xhr.onreadystatechange = function() {
                        if (xhr.readyState === 4 && xhr.status == 200) {
                            //手动转换
                            // let data = JSON.parse(xhr.response);
                            // console.log(data);
                            // result.innerHTML = data.name;
                            new Vue({
                                el: '#root', //el用于指定当前cue实例为哪个容器服务，通常为css选择器字符串。
                                data: xhr.response.data,
                            })
                        }
                    }
                },
                error: function() {}
            })


        }


        function getQueryVariable(variable) {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
            for (var i = 0; i < vars.length; i++) {
                var pair = vars[i].split("=");
                if (pair[0] == variable) {
                    return pair[1];
                }
            }
            return (false);
        }
    </script>
    </script>


</body>

</html>